<template>
	<view class="bigBox">
		<view class="bigTitle">
			<view class="img">
				<image class="title-img" src="../../../static/images/index/xcsvg.png"></image>
			</view>
			<view class="text">
				{{planName}}
			</view>
		</view>
		<view class="line"></view>
		<u-collapse :value="openValue" accordion>
			<u-collapse-item :title="`${item.name}`" :name="index" v-for="(item,index) in checkRuleList" :key="item.id">
				<view class="itemBox" @click.stop="handleToCheck(it,index)"
					v-for="it in checkRuleList[index].ruleDetails" :key="it.id">
					<view class="itemMain">{{it.content}}</view>
					<view class="itemBtn" >
						<!-- <u-tag @click="handleToCheck(it,index)" v-if="it.dangerStatus == -1" :show="false" text="-"
							plain plainFill>
						</u-tag> -->
						<!-- <u-tag @click="handleToCheck(it,index)" v-if="it.remark == '无隐患' && it.dangerStatus == 0"
							size="mini" text="无隐患" plain plainFill>
						</u-tag> -->
						<view class="no-danger" @click.stop="handleToCheck(it,index)"
							v-if="it.remark == '无隐患' && it.dangerStatus == 0">
							无隐患
						</view>
						<!-- <u-tag @click="handleToCheck(it,index)" v-if="it.dangerStatus == 1" size="mini" type="error"
							text="未整改" plain plainFill></u-tag>
						<u-tag @click="handleToCheck(it,index)" v-if="it.dangerStatus == 2" size="mini" type="success"
							text="重新整改" plain plainFill>
						</u-tag> -->
						<u-badge @click.stop="handleToCheck(it,index)" v-else  bgColor="red" max="99"
							:value="it.remark"></u-badge>
						<!-- <u-tag @click="handleToCheck(it,index)" v-if="it.dangerStatus == 3" size="mini" color="#2173DE"
							bgColor="rgba(14, 50, 97, 0.2)" text="已整改" plain plainFill>
						</u-tag>
						<u-tag @click="handleToCheck(it,index)" v-if="it.dangerStatus == 4" size="mini" color="#2173DE"
							bgColor="rgba(14, 50, 97, 0.2)" text="整改完成" plain plainFill>
						</u-tag> -->
						<u-icon name="arrow-right"></u-icon>
					</view>
				</view>
			</u-collapse-item>
		</u-collapse>
		<view class="kiss-list">
			<view class="kiss-list-title" style="padding: 22rpx 32rpx;">
				<view class="left">
					安全巡查员
				</view>
				<view class="right1" v-if="isInspec == 0">
					<view v-if="isSign">
						<view class="my-btn2" @click="handleSeeSign" v-if="sign">查看签名</view>
						<view class="my-btn" @click="handleCheckSign" v-else>一键签名</view>
					</view>
					<template v-else>
						<view @click="handleToSetSign">请签字</view>
						<view class="iconfont icon-app-xiangyou"></view>
					</template>

				</view>
				<view class="signBox" v-else>
					<view class="text">{{inspectionRecord.userName}}</view>
					<view class="my-btn2" @click="handleSeeSign">查看签名</view>
				</view>
			</view>
		</view>
		<view class="kiss-list" v-if="isInspec == 1">
			<view class="kiss-list-title">
				<view class="left">
					巡查时间
				</view>
				<view class="right1">
					{{inspectionRecord.submitTime || '无'}}
				</view>

			</view>
		</view>
		<template v-if="isInspec == 0">
			<view class="xing-subside"></view>
			<view class="xing-bottom">
				<view class="btn-right" @click="$dianji(sumbit,'onoff1')">提交</view>
			</view>
		</template>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				onoff: true,
				onoff1: true,
				inspectionId: '', //巡查任务id,
				planName: '', //巡查任务名称/检查项目
				checkRuleList: [], //检查规则
				inspectionRecord: {}, //巡查任务
				// 是否设置过签名
				isSign: false,
				oldSign: '',
				// 签名设置
				sign: '',
				openValue: '0',
				opIndex: '',
				isInspec: 0, //0编辑 1查看详情
			}
		},
		onLoad(options) {
			this.inspectionId = options.inspectionId
			this.planName = options.planName
			if (options.openValue) {
				this.opIndex = options.openValue
			}
			this.isInspec = options.isInspec
			this.initData()
			this.getSign()
		},
		onShow() {
			var pages = getCurrentPages(); // 获取当前页面栈
			var currentPage = pages[pages.length - 1]; // 当前页面
			if (currentPage.data.refreshIfNeeded) {
				currentPage.data.refreshIfNeeded = false;
				this.getSign(true)
			}
			if (currentPage.data.needGetData) {
				currentPage.data.needGetData = false;
				this.initData()
			}
		},
		// 下拉刷新
		onPullDownRefresh() {
			this.initData()
		},
		methods: {
			leftClick() {
				if (this.isInspec == 1) {
					uni.navigateBack({
						delta: 1
					})
					return
				}
				const params = {
					id: this.inspectionRecord.id,
					inspectionStatus: 0,
					sign: '' //签名照片
				}
				uni.showModal({
					title: '提示',
					content: '是否保存当前内容？',
					confirmText: '保存',
					cancelText: '不保存',
					success: function(res) {
						if (res.confirm) {
							uni.$u.http.post(`/check/mobile/appInspectionRecord/submitInspection`, params)
								.then(res => {
									if (res.code == 0) {
										uni.$u.toast('提交成功');
										uni.navigateBack({
											delta: 1
										})
									}
								})
						} else {
							uni.navigateBack({
								delta: 1
							})
						}
					}
				});
			},
			getSign(type = false) {
				uni.$u.http.get(`/base/mobile/userInfo/getLoginUserInfo`).then(res => {
					if (res.code == 0) {
						if (res.data.userSign) {
							this.isSign = true
							this.oldSign = res.data.userSign
							if (type) {
								this.sign = res.data.userSign
							}
						}
					}
				}).catch(err => {})
			},
			initData() {
				uni.$u.http.get(`/check/mobile/appDangerRuleItem/getCheckRuleList/${this.inspectionId}`).then(res => {
					if (res.code == 0) {
						this.checkRuleList = res.data.checkRuleList;
						this.inspectionRecord = res.data.inspectionRecord;
						this.openValue = this.opIndex
						uni.stopPullDownRefresh()
					}
				}).catch(err => {})
			},
			handleBack() {
				const params = {
					id: this.inspectionRecord.id,
					inspectionStatus: 0,
					sign: '' //签名照片
				}
				uni.$u.http.post(`/check/mobile/appInspectionRecord/submitInspection`, params).then(res => {
					if (res.code == 0) {
						uni.$u.toast('保存成功');
						uni.navigateBack({
							delta: 1
						})
					}
				})
			},
			sumbit() {


				if (this.sign == '') {
					uni.$u.toast('请先签名')
					return
				}
				let flag = false
				this.checkRuleList.map(item => {
					item.ruleDetails.map(it => {
						if (it.dangerStatus == -1) {
							flag = true
						}
					})
				})
				if (flag) {
					const params = {
						id: this.inspectionRecord.id,
						inspectionStatus: 1,
						sign: this.sign //签名照片
					}
					uni.showModal({
						title: '提示',
						content: '确定提交巡查信息吗？未巡查项默认【无隐患】',
						confirmText: '确定',
						cancelText: '取消',
						success: function(res) {
							if (res.confirm) {
								uni.$u.http.post(`/check/mobile/appInspectionRecord/submitInspection`, params)
									.then(res => {
										if (res.code == 0) {
											uni.$u.toast('提交成功');
											uni.navigateBack({
												delta: 1
											})
										}
									})
							}
						}
					});
					return
				}
				const params = {
					id: this.inspectionRecord.id,
					inspectionStatus: 1,
					sign: this.sign //签名照片
				}
				uni.showModal({
					title: '提示',
					content: '确定提交巡查信息吗？未巡查项默认【无隐患】',
					confirmText: '确定',
					cancelText: '取消',
					success: function(res) {
						if (res.confirm) {
							uni.$u.http.post(`/check/mobile/appInspectionRecord/submitInspection`, params)
								.then(res => {
									if (res.code == 0) {
										uni.$u.toast('提交成功');
										uni.navigateBack({
											delta: 1
										})
									}
								})
						}
					}
				});
			},
			handleToCheck(it, index) {
				
				if (this.isInspec == 1) {
					if (it.remark == "无隐患" || it.remark == '') {
						// 无隐患
						uni.navigateTo({
							url: `/pages/subPackagesA/troble/hideRectified?id=${it.dangerId}&remark=${it.remark}`
						})
					} else {
						// 有隐患 多个隐患列表
						uni.navigateTo({
							url: `/pages/subPackagesA/troble/multipleTroble?ruleId=${it.id}&inspectionId=${this.inspectionRecord.id}&rule=${it.rule}&content=${it.content}&isShow=${false}&isLook=${1}&regionName=${this.inspectionRecord.regionName}&type=${0}&suggestion=${it.suggestion}`
						})
					}
				} else {
					if (it.remark == "无隐患" ) {
						// 无隐患
						uni.navigateTo({
							url: `/pages/subPackagesA/troble/hideRectified?id=${it.dangerId}&remark=${it.remark}&isShowTime=${2}`
						})
						
					}else if (it.remark == '') {
						// 未填写 / 无隐患
						uni.navigateTo({
							url: `/pages/subPackagesA/troble/checkTroble?content=${it.content}&ruleId=${it.id}&inspectionId=${this.inspectionRecord.id}&dangerId=${it.dangerId}&regionName=${this.inspectionRecord.regionName}&rule=${it.rule}&planName=${this.planName}&openValue=${index}&remark=${it.remark}&suggestion=${it.suggestion}`
						})
					} else {
						// 有隐患 多个隐患列表
						uni.navigateTo({
							url: `/pages/subPackagesA/troble/multipleTroble?ruleId=${it.id}&inspectionId=${this.inspectionRecord.id}&rule=${it.rule}&content=${it.content}&isShow=${true}&isLook=${0}&regionName=${this.inspectionRecord.regionName}&type=${0}&planName=${this.planName}&suggestion=${it.suggestion}`
						})
					}
				}

			},
			handleCheckSign() {
				this.sign = this.oldSign
			},
			handleSeeSign() {
				let sign = ''
				if (this.isInspec == 1) {
					sign = this.inspectionRecord.sign
				} else {
					sign = this.sign
				}
				uni.$u.http.get(
					`/base/upload/bindFileUrl?fileUrl=${sign}`
				).then(res => {
					if (res.code == 0) {
						uni.navigateTo({
							url: `/pages/subPackagesD/mycenter/sginselect?url=
								${encodeURIComponent(JSON.stringify(res.data))}&noShow=true`
						})
					}
				}).catch(err => {})
			},
			handleToSetSign() {
				uni.navigateTo({
					url: `/pages/subPackagesD/mycenter/signname?nameType=sign`
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.bigBox {
		.line {
			height: 16rpx;
			background-color: #F5F5F5;
		}

		.bigTitle {
			font-size: 34rpx;
			font-weight: 500;
			background-color: #fff;
			padding: 32rpx;
			color: #2B2B2B;
			display: flex;
			align-items: center;

			.img {
				width: 40rpx;
				margin-right: 6rpx;
				display: flex;
				align-items: center;

				.title-img {
					width: 40rpx;
					height: 40rpx;
					object-fit: cover;
					
				}
			}
			.text{
				word-break: break-all;
				word-wrap: break-word;
			}
		}

		.itemBox {
			padding: 32rpx;
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			border-bottom: 2rpx solid #F5F5F5;

			.itemMain {
				flex: 1;
				line-height: 48rpx;
				font-size: 16px;
				font-weight: 400;
				color: #4D4D4D;
				word-wrap: break-word;
				word-break: break-all;
			}
			// .minWidth{
			// 	min-width: 160rpx;
			// }

			.itemBtn {
				margin-left: 20rpx;
				display: flex;
				align-items: center;
				justify-content: flex-end;
				min-width: 160rpx;

				.no-danger {
					border-radius: 4px;
					background: rgba(15, 83, 172, 0.2);
					color: #0F53AC;
					line-height: 18px;
					font-size: 12px;
					font-weight: 400;
					display: flex;
					justify-content: center;
					align-items: center;
					padding: 4px 12px 4px 12px;
				}
			}
		}

		.itemBox:last-child {
			border-bottom: none;
		}

		.nameBtn {
			display: flex;
			align-items: center;
			font-size: 34rpx;
			color: #8c8c8c;
		}

		.bottom-subside {
			width: 100%;
			height: 120rpx;
		}

		.bx-bottom {
			width: 100%;
			background: #f2f2f2;
			display: flex;
			justify-content: space-around;
			align-items: center;
			padding: 20rpx 0;
			position: fixed;
			z-index: 9;
			bottom: 0;

			.btn-right {
				width: 80%;
				height: 92rpx;
				border-radius: 12rpx;
				background: #0F53AC;
				display: flex;
				justify-content: center;
				align-items: center;
				color: #fff;
				font-size: 34rpx;
				font-weight: 500;
				letter-spacing: 0px;
				line-height: 0px;
			}
		}

		.my-btn {
			padding: 14rpx 24rpx;
			background: rgba(255, 255, 255, 1);
			border: 1px solid rgba(15, 83, 172, 1);
			color: rgba(15, 83, 172, 1);
			font-size: 28rpx;
			border-radius: 8rpx;
		}

		.my-btn2 {
			padding: 14rpx 24rpx;
			background: rgba(15, 83, 172, 1);
			border: 1px solid rgba(15, 83, 172, 1);
			color: rgba(255, 255, 255, 1);
			font-size: 28rpx;
			border-radius: 8rpx;
		}
		.signBox{
			display: flex;
			align-items: center;
			.text{
				font-size: 32rpx;
				color: #2B2B2B;
				margin-right: 24rpx;
			}
		}
	}
</style>